---
sidebar_position: 3
title: Installation
sidebar_label: Installation
---

import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";

An installation of Hyper Fetch can be run `clean` or for a specific environment. However, we only currently support
React.

:::info

The main `@hyper-fetch/core` package is required for other sub packages to work.

:::

---

## Typescript

TypeScript is used especially when you want to deploy pure Hyper Fetch logic, without an additional layer of abstraction
for a specific environment, library, or framework. This gives you access to Hyper Fetch’s base features.

<Tabs>
  <TabItem value="Npm" label="Npm" default>

```bash npm2yarn
npm install --save @hyper-fetch/core
```

  </TabItem>
  <TabItem value="Yarn" label="Yarn">

```bash npm2yarn
yarn add @hyper-fetch/core
```

  </TabItem>
</Tabs>

---

## Sockets

Sockets is created for handling websockets or server sent events.

<Tabs>
  <TabItem value="Npm" label="Npm" default>

```bash npm2yarn
npm install --save @hyper-fetch/sockets
```

  </TabItem>
  <TabItem value="Yarn" label="Yarn">

```bash npm2yarn
yarn add @hyper-fetch/sockets
```

  </TabItem>
</Tabs>

---

## React

React allows the installation of the base library with hooks, offering interfaces that facilitate library usage and
support the application lifecycle.

<Tabs>
  <TabItem value="Npm" label="Npm" default>

```bash npm2yarn
npm install --save @hyper-fetch/core @hyper-fetch/react
```

  </TabItem>
  <TabItem value="Yarn" label="Yarn">

```bash npm2yarn
yarn add @hyper-fetch/core @hyper-fetch/react
```

  </TabItem>
</Tabs>

## Firebase adapter

<Tabs>
  <TabItem value="Npm" label="Npm" default>

```bash npm2yarn
npm install --save @hyper-fetch/core @hyper-fetch/firebase
```

  </TabItem>
  <TabItem value="Yarn" label="Yarn">

```bash npm2yarn
yarn add @hyper-fetch/core @hyper-fetch/firebase
```

  </TabItem>
</Tabs>

## GraphQL adapter

<Tabs>
  <TabItem value="Npm" label="Npm" default>

```bash npm2yarn
npm install --save @hyper-fetch/core @hyper-fetch/graphql
```

  </TabItem>
  <TabItem value="Yarn" label="Yarn">

```bash npm2yarn
yarn add @hyper-fetch/core @hyper-fetch/graphql
```

  </TabItem>
</Tabs>

## Axios adapter

<Tabs>
  <TabItem value="Npm" label="Npm" default>

```bash npm2yarn
npm install --save @hyper-fetch/core @hyper-fetch/axios
```

  </TabItem>
  <TabItem value="Yarn" label="Yarn">

```bash npm2yarn
yarn add @hyper-fetch/core @hyper-fetch/axios
```

  </TabItem>
</Tabs>
